<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ include file="/common/taglibs.jsp" %>
<div class="rightfangge">
	<div class="tongyi_top">
		<span class="tongyibiaoti">过车报警信息</span><a href="###" class="gengduob" onclick="skipToVideo();">更多</a>
	</div>
    <div class="tongyi_zhongjiantu1">
    	<img id="imggc" onerror="javascript:this.src='${ctx}/images/dfsdfw2ww.jpg'" 
				style="width: 100%;height: 100%" onclick="showDetailPic(this.src)">
	</div>
	<table border="0" cellpadding="0" cellspacing="0" width="100%" class="dashujutable" style="margin:12px 0 18px;padding: 0 10px;" id="gcbjTable">
      	  <thead>
              <tr>
                <td height="26" align="center" class="dashujutable_top">设备名称</td>
                <td align="center" class="dashujutable_top">过车时间</td>
                <!-- <td align="center" class="dashujutable_top">号牌号码</td> -->
                <td align="center" class="dashujutable_top">布控类型</td>
              </tr>
          </thead>
          <tbody>
          </tbody>
    </table>
</div>		
<script type="text/javascript"> 
$(function(){ 
	initTable();
	//setInterval(initTable, 3000);
});
function initTable(){  
  	$.ajax({  
        type : "POST",  //提交方式  
        url : "${ctx}/alarm/findAlarm.htm",//路径    
        //数据，这里使用的是Json格式进行传输  
        dataType: "json",
        success : function(result) {//返回数据根据结果进行相应的处理   
        	if(result.rows[0].tpurl!=='0'){
        		$("#imggc").attr("src",result.rows[0].tpurl);
       			createDivContent(result.rows);
        	}
        }  
     });  
 }
function createDivContent(data){  
	    $("#gcbjTable tbody").empty();//清空原始数据
	    var tableBodyStr = "";
	    if(data==""){
	        tableBodyStr+="<tr onclick=\"checkTp(this)\" tpurl=\""+n.sbxh+"\">";
	      }else{
	    	  $.each(data,function(i,n){
	    		  if(i==8){//只显示8条数据
	  				return false;
		  		  }else{
		  			tableBodyStr+="<tr onclick=\"checkTp(this)\" tpurl=\""+n.tpurl+"\">";
					if(i%2==0){                      
						tableBodyStr+="<td height=\"28\" class=\"dashujutable_nr1\"  align=\"center\">"+n.sbmc+"</td>";
						tableBodyStr+="<td class=\"dashujutable_nr1\"  align=\"center\">"+n.jgsjStr+"</td>";
						//tableBodyStr+="<td class=\"dashujutable_nr1\"  align=\"center\">"+n.hphm+"</td>";
						tableBodyStr+="<td class=\"dashujutable_nr1\"  align=\"center\">"+n.bklxmc+"</td>";
					}else{
						tableBodyStr+="<td height=\"28\" class=\"dashujutable_nr2\"  align=\"center\">"+n.sbmc+"</td>";
						tableBodyStr+="<td class=\"dashujutable_nr2\"  align=\"center\">"+n.jgsjStr+"</td>";
						//tableBodyStr+="<td class=\"dashujutable_nr2\"  align=\"center\">"+n.hphm+"</td>";
						tableBodyStr+="<td class=\"dashujutable_nr2\"  align=\"center\">"+n.bklxmc+"</td>";
					}
					tableBodyStr+="</tr>";	
		  		  }
				});
	      }
	    $("#gcbjTable tbody").html(tableBodyStr);
	    //表格变颜色	
		$(".dashujutable>tbody>tr").hover(
		  function () {
		    $(this).children(".dashujutable_nr1").css({background:"#cee4ff"});
		  },
		  function () {
			 $(this).children(".dashujutable_nr1").css({background:"#ffffff"});
		  }
		);
		$(".dashujutable>tbody>tr").hover(
		  function () {
		    $(this).children(".dashujutable_nr2").css({background:"#cee4ff"});
		  },
		  function () {
			 $(this).children(".dashujutable_nr2").css({background:"#f1f1f1"});
		  }
		);
}
//跳转页面
function skipToVideo(){
	parent.addTab("过车监控","${ctx}/alarm/alarm.htm"); 
}
//查看图片
function checkTp(obj){
	$("#imggc").attr("src",$(obj).attr("tpurl"));
}
//打开图片 
function showDetailPic(id){
	window.open(id);
}
</script>	